---
title: Déployer votre site Astro sur Netlify
description: Comment déployer votre site Astro sur le web sur Netlify.
sidebar:
  label: Netlify
type: deploy
logo: netlify
supports: ['ssr', 'static']
i18nReady: true
---
import ReadMore from '~/components/ReadMore.astro';
import { Steps } from '@astrojs/starlight/components';

[Netlify](https://netlify.com) propose des services d'hébergement et de backend sans serveur (serverless) pour les applications web et les sites web statiques. Tout site Astro peut être hébergé sur Netlify !

Ce guide comprend des instructions pour le déploiement sur Netlify via l'interface utilisateur du site Web ou la CLI de Netlify.

## Configuration du projet

Votre projet Astro peut être déployé sur Netlify de trois manières différentes : en tant que site statique, en tant que site rendu côté serveur ou en tant que site rendu en périphérie.

### Site statique

Votre projet Astro est un site statique par défaut. Vous n'avez besoin d'aucune configuration supplémentaire pour déployer un site Astro statique sur Netlify.

### Adaptateur pour le rendu à la demande

Ajoutez [l'adaptateur Netlify](/fr/guides/integrations-guide/netlify/) pour activer le rendu à la demande dans votre projet Astro et déployez vers Netlify avec la commande `astro add` suivante. Celle-ci installera l'adaptateur et apportera les changements appropriés à votre fichier `astro.config.mjs` en une seule étape.

```bash
npx astro add netlify
```

<ReadMore>Consultez le [guide de l'adaptateur Netlify](/fr/guides/integrations-guide/netlify/) pour installer manuellement à la place, ou pour plus d'options de configuration, telles que le déploiement du middleware Astro de votre projet à l'aide des fonctions Edge de Netlify.</ReadMore>


## Comment déployer

Vous pouvez déployer sur Netlify via l'interface utilisateur du site Web ou en utilisant l'interface en ligne de commande (CLI) de Netlify. Le processus est le même pour les sites Astro statiques et rendus à la demande.

### Déploiement via l'interface utilisateur du site web

Si votre projet est stocké sur GitHub, GitLab, BitBucket, ou Azure DevOps, vous pouvez utiliser l'interface utilisateur de Netlify pour déployer votre site Astro.

<Steps>
1. Cliquez sur <kbd>Add new site</kbd> dans votre [tableau de bord Netlify](https://app.netlify.com/)

2. Choisissez <kbd>Import an existing project</kbd>

    Lorsque vous importez votre dépôt Astro depuis votre fournisseur Git, Netlify devrait automatiquement détecter et pré-remplir les paramètres de configuration corrects pour vous.

3. Assurez-vous que les paramètres suivants sont saisis, puis appuyez sur le bouton <kbd>Deploy</kbd> :

    - **Build command :** `astro build` ou `npm run build`
    - **Publish directory :** `dist`

    Après le déploiement, vous serez redirigé vers la page de présentation du site. Vous pourrez y modifier les détails de votre site.
</Steps>

Toute modification future de votre dépôt source déclenchera des déploiements de prévisualisation et de production en fonction de votre configuration de déploiement.

#### Le fichier `netlify.toml`

Vous pouvez éventuellement créer un nouveau fichier `netlify.toml` à la racine de votre dépôt de projet pour configurer votre commande de compilation et votre répertoire de publication, ainsi que d'autres paramètres du projet, y compris les variables d'environnement et les redirections. Netlify lira ce fichier et configurera automatiquement votre déploiement.

Pour configurer les paramètres par défaut, créez un fichier `netlify.toml` avec le contenu suivant :
    
```toml
[build]
  command = "npm run build"
  publish = "dist"
```

<ReadMore>Retrouvez plus d'informations sur le [« Déploiement d'un dépôt Astro Git existant » (Anglais)](https://www.netlify.com/blog/how-to-deploy-astro/#deploy-an-existing-git-repository-to-netlify) sur le blog de Netlify</ReadMore>

### Déploiement CLI

Vous pouvez également créer un nouveau site sur Netlify et relier votre dépôt Git en installant et en utilisant la [CLI de Netlify](https://cli.netlify.com/).

<Steps>
1. Installez la CLI de Netlify globalement : 
   
    ```bash
    npm install --global netlify-cli
    ```

2. Exécutez `netlify login` et suivez les instructions pour vous connecter et autoriser Netlify

3. Lancez `netlify init` et suivez les instructions

4. Confirmez votre commande de compilation (`astro build`)

    La CLI détectera automatiquement les paramètres de compilation (`astro build`) et le répertoire de déploiement (`dist`), et proposera de générer automatiquement [un fichier `netlify.toml`](#le-fichier-netlifytoml) avec ces paramètres.
    
5. Compilez et déployez en envoyant vers Git
   
   La CLI ajoutera une clé de déploiement au dépôt, ce qui signifie que votre site sera automatiquement recompilé sur Netlify chaque fois que vous utiliserez `git push`.
</Steps>

<ReadMore>Plus de détails de Netlify sur le [déploiement d'un site Astro à l'aide de la CLI de Netlify (Anglais)](https://www.netlify.com/blog/how-to-deploy-astro/#link-your-astro-project-and-deploy-using-the-netlify-cli)</ReadMore>

### Définir une version de Node.js

Si vous utilisez une ancienne [image de la compilation (Anglais)](https://docs.netlify.com/configure-builds/get-started/#build-image-selection) (Xenial) sur Netlify, assurez-vous que votre version de Node.js est définie. Astro nécessite la version `v18.20.8` ou `v20.3.0` ou une version plus récente.

Vous pouvez [spécifier votre version de Node.js dans Netlify (Anglais)](https://docs.netlify.com/configure-builds/manage-dependencies/#node-js-and-javascript) en utilisant :
- un fichier [`.nvmrc`](https://github.com/nvm-sh/nvm#nvmrc) dans votre répertoire de base.
- une variable d'environnement `NODE_VERSION` dans les paramètres de votre site en utilisant le tableau de bord du projet Netlify.

## Utilisation des fonctions Netlify

Aucune configuration particulière n'est nécessaire pour utiliser les fonctions Netlify avec Astro. Ajoutez un répertoire `netlify/functions` à la racine de votre projet et suivez [la documentation sur les fonctions Netlify (Anglais)](https://docs.netlify.com/functions/overview/) pour commencer !

## Exemples

- [Déploiement d'un site Astro avec des formulaires, des fonctions serverless et des redirections (Anglais)](https://www.netlify.com/blog/deploy-an-astro-site-with-forms-serverless-functions-and-redirects/) - Blog de Netlify
- [Vidéo de présentation du déploiement (Anglais)](https://youtu.be/GrSLYq6ZTes) - Chaîne YouTube de Netlify
